/**
 * This class provides a way how to make a screen 
 * gray, semitransparent, unclickable ... with a nice messagebox in the middle
 * 
 * used in ajax calls - when communicating with the server.
 * (when sending an offer to the interested in box)
 * 
 * @usage:
 * 		Shield.up("message");
 * 		Shield.down();
 * @return
 */

function Shield() {
	return this;
}

Shield.css = "" +
	"ul#statusbarshield {\n" +
		"visibility: hidden; \n" +
		"position: absolute; \n" +
		"width: 0px; \n" +
		"height: 0px; \n" +
	"}\n" +
	"ul#statusbarshield li.shield {\n" +
		"position: fixed; \n" +
		"top: 0px; \n" +
		"left: 0px; \n" +
		"display: none; \n" +
		"background-color: gray; \n" +
		"width: 100%; \n" +
		"height: 100%; \n" +
	"}\n" +
	"ul#statusbarshield li.waitmessagebox {\n" +
		"top: 50%; \n" +
		"left: 50%; \n" +
		"width: 300px; \n" +
		"position: fixed; \n" +
	"}\n" +
	"ul#statusbarshield li.waitmessagebox table {\n" +
		"background-color: white; \n" +
		"position: relative; \n" +
		"top: -50px; \n" +
		"left: -150px; \n" +
		"border: solid 2px gray; \n" +
		"width: 300px; \n" +
		"text-align: center; \n" +
		"opacity: 0.9; \n" +
		"padding: 5px 20px; \n" +
	"}\n" +
	"ul#statusbarshield li.waitmessagebox img { \n" +
		"vertical-align: middle; \n" +
	"} \n" +
	"ul#statusbarshield li.waitmessagebox td.waitstatuslayermessage { \n" +
		"margin: 0px 20px; \n" +
		"color: black; \n" +
		"font-weight: bold; \n" +
	"}";
			
Shield.node = null;
Shield.viewportwidth = null;
Shield.viewportheight = null;
Shield.isUp = false;

Shield.init = function() {
	// add css style for shield	
	var head = document.getElementsByTagName("head")[0];
	try {
		var styleShield = document.createElement("style");
		styleShield.appendChild(document.createTextNode(Shield.css));
		styleShield.setAttribute("type", "text/css");
		head.appendChild(styleShield);
	} catch (e) {
		var htmDiv = document.createElement('div');
		htmDiv.innerHTML = '<p>x</p><style>' + Shield.css + '</style>';
		head.appendChild(htmDiv.childNodes[1]);
	}
	
	// create shield's elements
	Shield.node = document.createElement("ul");
	Shield.node.setAttribute("id", "statusbarshield");
	Shield.node.bg = document.createElement("li");
	Shield.node.bg.className = "shield";
	Shield.node.bg.innerHTML = "<!-- -->";
	Shield.node.appendChild(Shield.node.bg);
	
	Shield.node.waitmessagebox = document.createElement("li");
	Shield.node.waitmessagebox.className = "waitmessagebox";
	Shield.node.waitmessagebox.innerHTML = '<table><tbody><tr><td style="width: 50px;"><img src="/img/statusbar-facebook.gif" alt="statusbar" /></td></tr></tbody></table>';
	
	Shield.node.msg = document.createElement("td");
	Shield.node.msg.className = "waitstatuslayermessage";
	
	Shield.node.waitmessagebox.firstChild.firstChild.firstChild.appendChild(Shield.node.msg);
	Shield.node.appendChild(Shield.node.waitmessagebox);
	
	if (typeof window.innerWidth != 'undefined') {
		Shield.viewportwidth = window.innerWidth,
		Shield.viewportheight = window.innerHeight
	} // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)	
	else if (typeof document.documentElement != 'undefined'
			&& typeof document.documentElement.clientWidth !=
			'undefined' && document.documentElement.clientWidth != 0) {
		Shield.viewportwidth = document.documentElement.clientWidth,
		Shield.viewportheight = document.documentElement.clientHeight
	} // older versions of IE
	else if (Shield.viewportwidth = document.getElementsByTagName('body')[0]) {
	      Shield.viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
	      Shield.viewportheight = document.getElementsByTagName('body')[0].clientHeight
	} else {
		 Shield.viewportwidth = 1250;
		 Shield.viewportheight = 800;
	}
	
	onLoad.add(function() {
		document.getElementsByTagName("body")[0].appendChild(Shield.node);
	});
};

Shield.down = function() {
	
	Shield.node.waitmessagebox.style.display = "none";
	Shield.node.bg.style.display = "none";
	
	Shield.node.bg.style.width = "0px";
	Shield.node.bg.style.height = "0px";
	Shield.node.style.visibility = "hidden";
	Shield.node.style.position = "absolute";
	
	Shield.isUp = false;
};
Shield.up = function(shieldMsg) {
	Shield.isUp = true;
	Shield.node.msg.innerHTML = shieldMsg;
	Shield.node.waitmessagebox.style.display = "block";
	Shield.node.bg.style.display = "block";
	if (typeof (Shield.node.bg.style.opacity) != "undefined")
		Shield.node.bg.style.opacity = 0.6;
	if (typeof (Shield.node.bg.style.filter) != "undefined")
		Shield.node.bg.style.filter = "alpha(opacity=60)";
	
	Shield.node.bg.style.width = Shield.viewportwidth + "px";
	Shield.node.bg.style.height = Shield.viewportheight + "px";
	
	Shield.node.style.position = "static";
	Shield.node.style.width = "0px";
	Shield.node.style.height = "0px";
	Shield.node.style.visibility = "visible";
};

Shield.init();
